<template>
	<view class="active-share-box" :style="{paddingTop:contentTop + 'px',paddingLeft: contentTop + 'px'}" @click="$emit('close')">
		<view class="active-share" v-if="right">
			<view class="share-arrow" :style="{right}"></view>
			<view class=""><text>点击上方</text> <image src="/static/img/share.png" mode="aspectFit"></image> <text>更多按钮</text> </view>
			<view class="">邀请来参加积福吧</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			contentTop:{
				type:Number,
				default:0
			}
		},
		data(){
			return{
				right:0
			}
		},
		mounted() {
			let menuInfo = uni.getMenuButtonBoundingClientRect()
			this.right = Math.floor(menuInfo.width / 2) + 'px'
		}
	}
</script>

<style>
	.active-share-box {position: fixed;z-index: 10;width: 100%;height: 100%;background-color: rgba(0, 0, 0, .3);top: 0;left: 0;padding-right: 20rpx;box-sizing: border-box;}
	.active-share{background-color: white;width: 100%;text-align: center;border-radius: 20rpx;padding: 20rpx 0 ;font-size: 36rpx;line-height: 60rpx;position: relative;margin-top: 60rpx;letter-spacing: 1px;}
	.active-share image {width: 60rpx;height: 60rpx;display: inline-block;margin: 0 10rpx;vertical-align: bottom;}
	.share-arrow{position: absolute;top:0;border-bottom: 40rpx solid white;border-left:  30rpx solid transparent;border-right:  30rpx solid transparent;transform: translateY(-90%);}
</style>